<template>
  <div class="box-padding">
    <div class="role-title">
      选择项目
    </div>
    <Row style="padding-top:30px;">
      <Col span="16"
           offset="4">
      <Row :gutter="16">
        <Col span="20">
        <Input v-model="name"
               placeholder="请选择项目" />
        </Col>
        <Col span="4">
        <Button type="primary"
                @click="search">搜索</Button>
        </Col>
      </Row>
      </Col>
    </Row>
    <Row style="padding-top:30px;">
      <Col span="16"
           offset="4">
      <Table :columns="columns1"
             :data="followProjectList"
             @on-row-click="toggleTableExpand"
             ref="tableExpand"></Table>
      </Col>
    </Row>
    <Layout class="layout-100">
      <Footer class="footer-cont">
        <Button @click="closetab">取消</Button>
      </Footer>
    </Layout>
  </div>
</template>
<script>
export default {
  data() {
    return {
      msg: {
        projectName: '',
        projectId: ''
      },
      name: '',
      columns1: [
        {
          title: '项目名称',
          align: 'center',
          key: 'shortName'
        },
        {
          title: '管理单位',
          key: 'manageEntName',
          align: 'center'
        }
      ],
      followProjectList: []
    }
  },
  computed: {},
  mounted() {
    this.getBasicInfo()
  },
  methods: {
    getBasicInfo(){
      let code = this.$route.params.deptId;
      this.$api.ProjectPerson.getBasicInfo(code).then(res => {
        if (res.code === 200) {
          this.followProjectList = res.data.mangeScope.projectList;//关注项目
        } else {
          this.$Message.error(res.message)
        }
      })
    },
    search(){
      if(this.name){
        let newArr = [];
        this.followProjectList.forEach(item=>{
          if(item.shortName.indexOf(this.name)>=0){
            newArr.push(item);
          }
        })
        this.followProjectList = newArr;
      }else{
        this.getBasicInfo();
      }

    },
    toggleTableExpand(row) {
      this.msg = {
        shortName: row.shortName,
        id: row.id,
        dictEngineeringTypeName:row.dictEngineeringTypeName
      }
      this.$emit('func', this.msg)
    },
    closetab(){
      this.$emit('func', '');
    }
  }
}
</script>
<style scoped>
</style>